import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import { ConfigProvider } from 'antd';
import zhCN from 'antd/locale/zh_CN';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';

import App from './App';
import './index.css';

// 设置dayjs中文语言
dayjs.locale('zh-cn');

// Ant Design浅色主题配置
const lightTheme = {
  token: {
    colorPrimary: '#4f46e5',
    colorPrimaryBg: '#eef2ff',
    colorPrimaryBgHover: '#e0e7ff',
    colorPrimaryBorder: '#c7d2fe',
    colorPrimaryBorderHover: '#a5b4fc',
    colorPrimaryHover: '#6366f1',
    colorPrimaryActive: '#3730a3',
    colorPrimaryTextHover: '#6366f1',
    colorPrimaryText: '#4f46e5',
    colorPrimaryTextActive: '#3730a3',
    borderRadius: 8,
    borderRadiusLG: 12,
    colorBgContainer: '#ffffff',
    colorBgElevated: '#ffffff',
    colorBgLayout: '#f8fafc',
    colorBorder: '#e2e8f0',
    colorBorderSecondary: '#f1f5f9',
    colorText: '#1f2937',
    colorTextSecondary: '#6b7280',
    colorTextTertiary: '#9ca3af',
    colorTextQuaternary: '#d1d5db',
    fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
  },
  components: {
    Layout: {
      siderBg: '#ffffff',
      triggerBg: '#f8fafc',
      bodyBg: '#f8fafc',
      headerBg: '#ffffff',
    },
    Menu: {
      itemBg: 'transparent',
      itemSelectedBg: '#eef2ff',
      itemSelectedColor: '#4f46e5',
      itemHoverBg: '#f8fafc',
      itemColor: '#64748b',
      groupTitleColor: '#475569',
      iconSize: 16,
      itemBorderRadius: 8,
    },
    Button: {
      borderRadius: 8,
      controlHeight: 40,
      fontWeight: 500,
    },
    Card: {
      borderRadius: 12,
      boxShadowTertiary: '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)',
    },
    Input: {
      borderRadius: 8,
      controlHeight: 40,
    },
    Select: {
      borderRadius: 8,
      controlHeight: 40,
    },
    Table: {
      borderRadius: 8,
      headerBg: '#f8fafc',
    },
    Tabs: {
      borderRadius: 8,
    },
    Modal: {
      colorBgElevated: '#ffffff',
    },
    Drawer: {
      colorBgElevated: '#ffffff',
    },
  },
};

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <BrowserRouter>
      <ConfigProvider
        locale={zhCN}
        theme={lightTheme}
      >
        <App />
      </ConfigProvider>
    </BrowserRouter>
  </React.StrictMode>
); 